<!--
* description: 城市弹出框（含输入框）
* author: meijq
* createdDate: 2019-08-19
-->
<template>
  <section class="cartypeQuery">
    <el-dialog
      id="cartypeq"
      v-dialogDrag
      title="关联订单选择"
      :visible.sync="popupsVisible"
      width="1050px"
      center
      :append-to-body="true"
      :lock-scroll="true"
      :before-close="handleClose"
    >
      <dialogHeader
        slot="title"
        :title="'关联订单选择'"
        :style-type="$store.state.app.dialogType"
      />
      <one-table-template
        ref="multipleTable"
        :dynamic-api-config="dynamicApiConfig"
        :dynamic-buttons="dynamicButtons"
        :dynamic-components="tableComponents"
        :dynamic-table-cols="dynamicTableCols"
        :dynamic-form-fields="formField"
        :dynamic-table-defult-height="300"
        :dynamic-is-show-more-btn="true"
        :dynamic-is-show-select="false"
        :dynamic-is-init-table="true"
        :dynamic-api-style="apiStyle"
        :dynamic-page-size="15"
        :refresh-table-key="refreshTableKey"
        :callback-obj="callbackObj"
        @hiddenColData="hiddenColData"
      />
      <!-- <div
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          size="mini"
          type="primary"
          icon="iconfont  icon-confirm"
          @click="sendCode"
        >{{ $t('sys.button.confirm') }}
        </el-button>
        <el-button
          size="mini"
          icon="iconfont  icon-close"
          @click="close"
        >{{ $t('取消') }}
        </el-button>
      </div> -->
    </el-dialog>
  </section>
</template>
<script>
import { oneTableWithViewTemplateMixins } from '@/components/mixins/oneTableWithViewTemplateMixins'
import OneTableTemplate from '@/components/templates/oneTable'
import Vue from 'vue'
import commFields from '@/views/ve/testDriverManage/common'
export default {
  name: 'CarTypeConfig',
  components: {
    dialogHeader: () => import('@/components/dialogHeader'), // 弹窗标题,
    OneTableTemplate
  },
  mixins: [oneTableWithViewTemplateMixins],
  props: {
    popupsVisible: { type: Boolean, default: false },
    code: { type: String, default: '' },
    comType: { type: String, default: '' },
    codeField: { type: String, default: '' },
    popupsKey: { type: String, default: '' },
    isMul: { type: Boolean, default: true },
    dataForForm: {
      type: String,
      default: ''
    },
    validrule: {
      type: Object,
      default: () => {}
    }
  },
  beforeRouteEnter(to, from, next) {
    Vue.prototype.$ConfigCache.CacheConfig.initData(
      // 同时加载当前页面和编辑框页面的配置
      [to.path, ''],
      function() {
        next()
      })
  },
  data() {
    const viewPageCode = this.$route.path
    // 绑定事件配置化事件
    this.$ConfigCache.CacheConfig.bindEvent(this, [viewPageCode])
    return {
      table: null,
      curSelected: null,
      saleOrderType: '',
      selectData: {},
      clickRowsData: {},
      dynamicApiConfig: {
        APIUrl: '/mp/e3sh/vesale/salertnmgr/salesReturnService/queryReturnByOrder.do'
      },
      apiStyle: 'restful',
      dynamicButtons: this.$ConfigCache.CacheConfig.cacheData[viewPageCode] &&
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableButtons &&
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableButtons.length > 0
        ? this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableButtons
        : [
          {
            compKey: 'btnKey1',
            type: 'primary',
            size: 'small',
            name: 'search',
            clickEvent: () => this.queryTable(),
            position: 'right',
            text: '查询'
          },
          {
            compKey: 'btnKey2',
            type: '',
            size: 'small',
            name: 'reset',
            clickEvent: this.reset,
            position: 'right',
            text: '重置'
          }

        ],

      tableComponents:
          this.$ConfigCache.CacheConfig.cacheData[viewPageCode] &&
          this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableComponents.length > 0
            ? this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableComponents
            : [
              {
                compKey: 'compKey1',
                labelName: 'DMS订单编号：',
                codeField: 'saleOrderCode',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMust: true,
                span: 6
              },
              {
                compKey: 'compKey2',
                labelName: 'C端订单号：',
                codeField: 'saleOrderCodeC',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMust: true,
                span: 6
              },
              {
                compKey: 'compKey3',
                labelName: 'VIN码：',
                codeField: 'vin',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMust: true,
                span: 6
              },
              {
                compKey: 'compKey4',
                labelName: '销售计划号：',
                codeField: 'salesPlanCode',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMust: true,
                span: 6
              },
              {
                compKey: 'compKey5',
                labelName: '客户姓名：',
                codeField: 'custName',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMust: false,
                span: 6
              },
              {
                compKey: 'compKey6',
                labelName: '客户电话：',
                codeField: 'custTel',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMust: false,
                span: 6
              },
              ...commFields.deliveryCityAndDlr(),
              {
                compKey: 'compKey7',
                labelName: '交付专员：',
                codeField: 'empName',
                component: () => import('@/components/org/commonInput'),
                type: 'inputText',
                isMust: false,
                span: 6
              },
              ...commFields.ModelOptionsNotDisabled()
            ],
      dynamicTableCols: this.$ConfigCache.CacheConfig.cacheData[viewPageCode] &&
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableCols.length > 0
        ? this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableCols
        : [
          {
            prop: 'releaseId',
            label: '主键ID',
            hidden: true,
            alwaysHidden: true
          },
          {
            prop: 'updateControlId',
            label: '并发控制ID',
            hidden: true,
            alwaysHidden: true
          },
          {
            prop: 'saleOrderCode',
            label: 'DMS订单编号'
          },
          {
            prop: 'saleOrderCodeC',
            label: 'C端订单号'
          },
          {
            prop: 'orderStatusName',
            label: '订单状态'
          },
          {
            prop: 'salesPlanCode',
            label: '销售计划号'
          },
          {
            prop: 'vin',
            label: 'VIN码'
          },
          {
            prop: 'custName',
            label: '客户姓名'
          },
          {
            prop: 'custTel',
            label: '客户电话'
          },
          {
            prop: 'cityName',
            label: '交付城市'
          },
          {
            prop: 'dlrFullName',
            label: '交付门店'
          },
          {
            prop: 'empName',
            label: '交付专员'
          },
          ...commFields.ModelOptionsTableCol(),
          {
            prop: 'enterpriseName',
            label: '已收尾款金额'
          }
        ],
      refreshTableKey: '0',
      ruleSettingShow: false,

      curPopupsVisible: this.popupsVisible,
      // 单表格模版页面组件回调事件
      callbackObj: {
        onRowDbClick: (row) => {
          this.selectData = row
          this.sendCode()
        }
      },
      formField: {
        saleOrderCode: '',
        saleOrderCodeC: '',
        vin: '',
        salesPlanCode: '',
        custName: '',
        custTel: '',
        cityCode: '',
        deliveryDlrId: '',
        empName: '',
        saleOrderType: '',
        carSeriesId: '',
        carConfigId: '',
        carConfigCn: '',
        carSeriesCn: '',
        optionalPagId: '',
        carColorId: '',
        carIncolorId: '',
        deliveryCityId: ''
      }
    }
  },
  watch: {
    dataForForm(val) {
      // var obj = { saleOrderType: val }
      // Object.assign(this.formField, obj)
      // this.queryTable(1)
    }
  },
  created() {

  },
  mounted() {
    var obj = { saleOrderType: this.dataForForm }
    Object.assign(this.formField, obj)
    this.$nextTick(() => {
      this.queryTable(1)
    })
  },
  methods: {
    // 获取数据
    sendCode() {
      if (this.selectData.hasOwnProperty('index')) {
        this.$parent.modelText = this.selectData.saleOrderCode
        this.$parent.modelCode = this.selectData.saleOrderCode
        this.$parent.$parent.$parent.$parent.list = this.selectData
        this.$parent.$parent.$parent.$parent.formField.receivedAmount = this.selectData.receivedAmount
        this.$parent.$parent.$parent.$parent.formField.receivedEnd = this.selectData.receivedEnd
        this.$parent.$parent.$parent.$parent.formField.receivedDespoist = this.selectData.receivedDespoist
        this.$parent.$parent.$parent.$parent.formField.UPDATE_CONTROL_ID = this.selectData.UPDATE_CONTROL_ID
        this.$parent.$parent.$parent.$parent.formField.SALE_ORDER_ID = this.selectData.SALE_ORDER_ID
        this.$parent.$parent.$parent.$parent.formField.orderStatus = this.selectData.orderStatus
        this.$emit('update:popupsVisible', false)
      } else {
        this.$message('还没有选择车型配置！')
      }
    },

    // 设置表格选择框 是否禁用
    // getSelectable(row, index) {
    // },

    // 设置表格单选
    handleOneSelect(selection) {
      if (selection.length === 0) { this.selectData = {}; return }
      const lastIndex = selection.length - 1
      this.table = this.$refs.multipleTable.$children[3]
      this.selectData = selection[lastIndex]
      selection.forEach((sel, idx) => {
        lastIndex !== idx ? this.table.toggleRowSelection(sel, false) : this.curSelected = sel
      })
    },
    // handleSelectionChange(selection) {
    //   const btns = this.dynamicButtons.filter(o => o.disabled !== undefined)
    //   if (btns.length > 0) {
    //     const isCheck = selection && selection.length > 0
    //     btns.forEach((item) => {
    //       item.disabled = !isCheck
    //     })
    //   }
    // },
    handleClose() {
      // let message
      // this.selectData.hasOwnProperty('index') ? message = '确认关闭？' : message = '还未选择车型配置，确认关闭？'
      // this.$confirm(`${message}`)
      //   .then(_ => {
      this.$emit('update:popupsVisible', false)
      // this.table.toggleRowSelection(this.curSelected, false)
      //   done()
      // })
      // .catch(_ => {})
    },
    hiddenColData(data) {
      if (data && data.length > 0) {
        this.refreshTableKey += 1
        this.dynamicTableCols = data
      }
    },
    close() {
      this.$emit('update:popupsVisible', false)
    }
  }
}
</script>

<style lang="css" scoped>
  >>>div.el-table__empty-block{
    height: 200px;
  }
  div.el-table__body-wrapper.is-scrolling-none{
    height: 200px;
  }
  >>>.el-table__header .el-checkbox{
    display:none
  }
</style>
